<template>
    <xh-pages>
        <view class="page flex flex-column">
            <view class="flex-1" />
            <view class="py-10 flex flex-center">
                <view class="p-6 rounded-circle bg-danger">
                    <u-icon name="info-circle" size="70" color="var(--xl-white)"></u-icon>
                </view>
            </view>
            <view class="mt-10">
                <view class="h8 text-center font-weight-600">错误码：{{ code }}</view>
                <view class="h10 text-center font-weight-600 mt-6">{{ message }}</view>
            </view>
            <view class="flex-1" />
            <view class="mt-10 px-10">
                <view class="bg-danger text-white rounded-4 px-6 py-4 font-weight-600 text-center h10"
                    hover-class="bg-danger-dark-1" @click="close">
                    返回首页
                </view>
            </view>
            <view class="flex-1" />
        </view>
    </xh-pages>
</template>

<script lang="ts" setup>
const message = ref('');
const code = ref('');
onLoad((options: any) => {
    message.value = options.msg;
    code.value = options.errcode;
})
const close = () => {
    uni.reLaunch({
        url: '/pages/index/index'
    })
}
</script>

<style lang="scss" scoped>
.page {
    height: calc(100vh - var(--window-top));
}
</style>
